﻿@using Telerik.Web.Mvc.UI;
@using SmartStore.Core.Search.Facets;
@model ProductAttributeModel

@Html.ValidationSummary(false)
@Html.HiddenFor(model => model.Id)
@Html.SmartStore().TabStrip().Name("productattribute-edit").Style(TabsStyle.Material).Items(x =>
{
	x.Add().Text(T("Common.General").Text).Content(TabInfo()).Selected(true);
	x.Add().Text(T("Admin.Catalog.Attributes.OptionsSets").Text).Content(TabOptionsSets());

	EngineContext.Current.Resolve<IEventPublisher>().Publish(new TabStripCreated(x, "productattribute-edit", this.Html, this.Model));
})

@helper TabInfo()
{
	if (Model.Id != 0)
	{
		<table class="adminContent">
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Id)
				</td>
				<td class="adminData">
					@Html.TextBoxFor(model => model.Id, new { @readonly = "readonly", @class = "form-control-plaintext" })
					@Html.ValidationMessageFor(model => model.Id)
				</td>
			</tr>
		</table>
	}

	@(Html.LocalizedEditor<ProductAttributeModel, ProductAttributeLocalizedModel>("productattribute-localized",
		@<table class="adminContent">
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Locales[item].Name)
				</td>
				<td class="adminData">
					@*IMPORTANT: Do not delete, this hidden element contains the id to assign localized values to the corresponding language *@
					@Html.HiddenFor(model => model.Locales[item].LanguageId)

					@Html.EditorFor(model => Model.Locales[item].Name)
					@Html.ValidationMessageFor(model => model.Locales[item].Name)
				</td>
			</tr>
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Locales[item].Alias)
				</td>
				<td class="adminData">
					@Html.EditorFor(model => Model.Locales[item].Alias)
					@Html.ValidationMessageFor(model => model.Locales[item].Alias)
				</td>
			</tr>
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Locales[item].Description)
				</td>
				<td class="adminData wide">
					@Html.EditorFor(model => model.Locales[item].Description, "Html")
					@Html.ValidationMessageFor(model => model.Locales[item].Description)
				</td>
			</tr>
		</table>
		,
		@<table class="adminContent">
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Name)
				</td>
				<td class="adminData">
					@Html.EditorFor(model => model.Name)
					@Html.ValidationMessageFor(model => model.Name)
				</td>
			</tr>
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Alias)
				</td>
				<td class="adminData">
					@Html.EditorFor(model => model.Alias)
					@Html.ValidationMessageFor(model => model.Alias)
				</td>
			</tr>
			<tr>
				<td class="adminTitle">
					@Html.SmartLabelFor(model => model.Description)
				</td>
				<td class="adminData wide">
					@Html.EditorFor(x => x.Description, "Html")
					@Html.ValidationMessageFor(model => model.Description)
				</td>
			</tr>
		</table>
	))

	<table id="ProductAttributeTable" class="adminContent">
		<tr>
			<td class="adminTitle">
				@Html.SmartLabelFor(model => model.DisplayOrder)
			</td>
			<td class="adminData">
				@Html.EditorFor(model => model.DisplayOrder)
				@Html.ValidationMessageFor(model => model.DisplayOrder)
			</td>
		</tr>
		<tr>
			<td class="adminTitle">
				@Html.SmartLabelFor(model => model.AllowFiltering)
			</td>
			<td class="adminData">
				@Html.CheckBoxFor(model => model.AllowFiltering, new { data_toggler_for = "#pnlAllowFiltering" })
				@Html.ValidationMessageFor(model => model.AllowFiltering)
			</td>
		</tr>
		<tr id="pnlAllowFiltering">
			<td class="adminTitle">
				@Html.SmartLabelFor(model => model.FacetTemplateHint)
			</td>
			<td class="adminData">
				@Html.DropDownListFor(model => model.FacetTemplateHint, 
					Model.FacetTemplateHint.ToSelectList().Where(x => x.Value.ToInt() != (int)FacetTemplateHint.NumericRange).ToList())
				@Html.ValidationMessageFor(model => model.FacetTemplateHint)
			</td>
		</tr>
        <tr>
            <td class="adminTitle">
                @Html.SmartLabelFor(model => model.IndexOptionNames)
            </td>
            <td class="adminData">
                @Html.EditorFor(model => model.IndexOptionNames)
                @Html.ValidationMessageFor(model => model.IndexOptionNames)
            </td>
        </tr>
        <tr>
            <td class="adminTitle">
                @Html.SmartLabelFor(model => model.ExportMappings)
            </td>
            <td class="adminData">
				@Html.TextAreaFor(model => model.ExportMappings, new { style = "min-height: 120px;" })
                @Html.ValidationMessageFor(model => model.ExportMappings)
            </td>
        </tr>
		<tr>
			<td class="adminTitle"></td>
			<td class="adminData">
				<div class="alert alert-info">
					@Html.Raw(T("Admin.Catalog.Attributes.ProductAttributes.Fields.ExportMappings.Note"))
				</div>
			</td>
		</tr>
	</table>
}

@helper TabOptionsSets()
{
	if (Model.Id > 0)
	{
		<div>
			@(Html.Telerik().Grid<ProductAttributeOptionsSetModel>()
				.Name("productattributeoptionsset-grid")
				.DataKeys(keys =>
				{
					keys.Add(x => x.Id);
					keys.Add(x => x.ProductAttributeId).RouteKey("productAttributeId");
				})
				.ToolBar(commands => commands.Insert())
				.Columns(columns =>
				{
					columns.Bound(x => x.Name);
					columns.Command(commands =>
					{
						commands.Edit().Localize(T);
						commands.Delete().Localize(T);
					})
					.HtmlAttributes(new { align = "right" })
					.Width(120);
				})
				.DataBinding(dataBinding => dataBinding.Ajax()
					.Select("OptionsSetList", "ProductAttribute", new { productAttributeId = Model.Id })
					.Insert("OptionsSetInsert", "ProductAttribute", new { productAttributeId = Model.Id })
					.Update("OptionsSetUpdate", "ProductAttribute")
					.Delete("OptionsSetDelete", "ProductAttribute")
				)
				.EnableCustomBinding(true)
				.DetailView(details => details.ClientTemplate(
					Html.Telerik().Grid<ProductAttributeOptionModel>()
						.Name("productattributeoptions-grid<#= Id #>")
						.DataKeys(keys =>
						{
							keys.Add(x => x.Id);
							keys.Add(x => x.ProductAttributeOptionsSetId).RouteKey("optionsSetId");
						})
						.ToolBar(commands => commands.Template(OptionGridCommands))
						.Columns(columns =>
						{
							columns.Bound(x => x.Name)
								.ClientTemplate(@Html.VariantAttributeValueName());
							columns.Bound(x => x.Alias);
							columns.Bound(x => x.LinkedProductName)
								.ClientTemplate(@Html.LabeledProductName("LinkedProductId", "LinkedProductName", "LinkedProductTypeName", "LinkedProductTypeLabelHint"));
							columns.Bound(x => x.PriceAdjustmentString)
								.Centered();
							columns.Bound(x => x.WeightAdjustmentString)
								.Centered();
							columns.Bound(x => x.IsPreSelected)
								.ClientTemplate(@Html.SymbolForBool("IsPreSelected"))
								.Centered();
							columns.Bound(x => x.DisplayOrder)
								.Centered();
							columns.Bound(x => x.Id)
								.Width(220)
								.Centered()
								.Title("")
								.ClientTemplate(
									"<a href='" + @Url.Content("~/Admin/ProductAttribute/OptionEditPopup/") + "<#= Id #>?btnId=btnOptionRefresh' class='btn btn-secondary edit-option'>" + @T("Admin.Common.Edit") + "</a>" +
									"<a href='" + @Url.Action("OptionDelete", "ProductAttribute") + "/<#= Id #>?btnId=btnOptionRefresh' class='btn btn-danger ml-1 delete-option'>" + @T("Admin.Common.Delete") + "</a>")
								.HtmlAttributes(new { align = "right" });
						})
						.DataBinding(dataBinding => dataBinding.Ajax()
							.Select("OptionsSetListDetails", "ProductAttribute", new { id = "<#= Id #>" })
						)
						.ToHtmlString()
				)))
		</div>

		<input type="button" id="btnOption" name="btnOption" class="d-none" />
		<input type="button" id="btnOptionRefresh" name="btnOptionRefresh" value="" class="d-none" />

		<script type="text/javascript">
			$(document).ready(function () {

				var mainGrid = $('#productattributeoptionsset-grid');

				// refresh options set grid
                $('#btnRefresh').click(function () {
					mainGrid.data('tGrid').ajaxRequest();
                    return false;
                });
				
				// refresh options set child grid
				$(document).on('click', 'input[id=btnOptionRefresh]', function () {
                	$('#productattributeoptions-grid' + $(this).val()).data('tGrid').ajaxRequest();
                	return false;
                });

				// add option
				$(mainGrid).on('click', '.t-grid-insert-option', function (e) {
                	e.preventDefault();
                	var id = $(this).closest('.t-grid').attr('id').replace('productattributeoptions-grid', '');
					$('#btnOptionRefresh').val(id);
                	openPopup('@Url.Content("~/Admin/ProductAttribute/OptionCreatePopup/")' + id + '?&btnId=btnOptionRefresh');
                	return false;
                });

				// edit option
				$(mainGrid).on('click', 'a.edit-option', function (e) {
					e.preventDefault();
					var id = $(this).closest('.t-grid').attr('id').replace('productattributeoptions-grid', '');
					$('#btnOptionRefresh').val(id);
					openPopup($(this).attr('href'));
					return false;
				});

				// delete option
				$(mainGrid).on('click', 'a.delete-option', function (e) {
					e.preventDefault();
					var grid = $(this).closest('.t-grid').data('tGrid');
					$(this).doAjax({
						type: 'POST',
						ask: @T("Admin.Common.AskToProceed").JsText,
						callbackSuccess: function () {
							grid.ajaxRequest();
						}
					});
					return false;
				});
			});
		</script>
	}
	else
	{
		<div class="alert alert-warning">
			@T("Admin.SaveBeforeEdit")
		</div>
	}
}

@helper OptionGridCommands(Grid<ProductAttributeOptionModel> grid)
{
	<button type="button" class="btn btn-below btn-warning t-grid-insert-option">
		<i class="fa fa-plus"></i>
		<span>@T("Common.Options.Add")</span>
	</button>
}